<template>
  <div id="info" class="mytable">
    <div v-if="loadingText" style="padding: 10px;">{{ loadingText }}</div>
    <el-scrollbar v-else style="height: calc(100% + 17px)">
      <table cellspacing="0" cellpadding="0" class="bztable centertable">
        <template v-if="sourceTable==='depart' || sourceTable==='centre_sy'">
          <tr>
            <th>批准内设机构数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="detailInfo.countNsjgs" :min="0"></el-input-number>
            </td>
            <td v-else>{{ detailInfo.countNsjgs }}</td>
            <th>实有内设机构数</th>
            <td>{{ detailInfo.countNsjgsShiyou }}</td>
          </tr>
          <!-- <tr>
            <th>批准其他工作机构数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="detailInfo.countQtgzjgs" :min="0"></el-input-number>
            </td>
            <td v-else>{{ detailInfo.countQtgzjgs }}</td>
            <th>实有其他工作机构数</th>
            <td>{{ detailInfo.countNsjgsShiyouQita }}</td>
          </tr> -->
          <tr v-if="sourceTable==='centre_sy'">
            <th>事业编制数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="detailInfo.SYBZHD" :min="0"></el-input-number>
            </td>
            <td v-else>{{ detailInfo.SYBZHD }}</td>
            <th>在编人数</th>
            <td>{{ detailInfo.SYBZZB }}</td>
          </tr>
          <tr v-if="sourceTable==='depart'">
            <th>行政编制数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="detailInfo.DABZST" :min="0"></el-input-number>
            </td>
            <td v-else>{{ detailInfo.DABZST }}</td>
            <th>行政在编人数</th>
            <td>{{ detailInfo.DRBZST }}</td>
          </tr>
        </template>

        <template v-if="sourceTable === 'office'">
          <tr>
            <th>行政编制数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="officeInfo.oabzSt" :min="0"></el-input-number>
            </td>
            <td v-else>{{ officeInfo.oabzSt }}</td>
            <th>行政在职人数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="officeInfo.orbzSt" :min="0"></el-input-number>
            </td>
            <td v-else>{{ officeInfo.orbzSt }}</td>
          </tr>
          <!-- <tr>
            <th>事业编制数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="officeInfo.orsybz" :min="0"></el-input-number>
            </td>
            <td v-else>{{ officeInfo.orsybz }}</td>
            <th>事业实有人数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="officeInfo.oasybz" :min="0"></el-input-number>
            </td>
            <td v-else>{{ officeInfo.oasybz }}</td>
          </tr> -->
        </template>

        <template v-if="sourceTable === 'centre_sy_nsjg'">
          <tr>
            <th>财政补助编制数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="centreSyNsjgInfo.slnCzbkbzrs" :min="0"></el-input-number>
            </td>
            <td v-else>{{ centreSyNsjgInfo.slnCzbkbzrs }}</td>
            <th>财政补助实有人数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="centreSyNsjgInfo.slnCzbksyry" :min="0"></el-input-number>
            </td>
            <td v-else>{{ centreSyNsjgInfo.slnCzbksyry }}</td>
          </tr>
          <tr>
            <th>经费自理编制数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="centreSyNsjgInfo.slnJfzlbzrs" :min="0"></el-input-number>
            </td>
            <td v-else>{{ centreSyNsjgInfo.slnJfzlbzrs }}</td>
            <th>经费自理实有人数</th>
            <td v-if="flag === 'user'">
              <el-input-number v-model="centreSyNsjgInfo.slnJfzlsyry" :min="0"></el-input-number>
            </td>
            <td v-else>{{ centreSyNsjgInfo.slnJfzlsyry }}</td>
          </tr>
          <tr>
            <th>核定事业编制总计</th>
            <td v-if="flag === 'user'" colspan="3">
              <el-input-number v-model="centreSyNsjgInfo.slnBzrsZj" :min="0"></el-input-number>
            </td>
            <td v-else colspan="3">{{ centreSyNsjgInfo.slnBzrsZj }}</td>
          </tr>
        </template>
      </table>
      <div v-if="flag === 'user'" style="display: flex; justify-content: center; margin-bottom: 20px;">
        <el-button type="primary" :loading="btnLoading" @click="saveData()">保存</el-button>
      </div>
    </el-scrollbar>
  </div>
</template>

<script>
export default {
  name: 'DetailCompile',
  props: {
    jgsyCode: '',
    flag: '',
    type: '',
    sourceTable: '',
    allPersonInfoList: [],
    officeDetailInfo: {},
    centreSyNsjgDetailInfo: {}
  },
  watch: {
    jgsyCode: {
      handler () {
        this.loadingText = '正在加载中，请稍后...'
      },
      immediate: true
    },
    allPersonInfoList: {
      handler () {
        if (this.sourceTable === 'depart' || this.sourceTable === 'centre_sy') {
          this.getDetailInfo()
        }
      },
      immediate: true
    },
    officeDetailInfo: {
      handler () {
        if (this.sourceTable === 'office') {
          this.officeInfo = this.officeDetailInfo
          this.loadingText = ''
        }
      },
      immediate: true
    },
    centreSyNsjgDetailInfo: {
      handler () {
        if (this.sourceTable === 'centre_sy_nsjg') {
          this.centreSyNsjgInfo = this.centreSyNsjgDetailInfo
          this.loadingText = ''
        }
      },
      immediate: true
    }
  },
  data () {
    return {
      loadingText: '正在加载中，请稍后...',
      detailInfo: {
        countNsjgs: 0,
        countNsjgsShiyou: 0,
        countQtgzjgs: 0,
        countNsjgsShiyouQita: 0,
        SYBZHD: 0,
        SYBZZB: 0,
        DABZST: 0,
        DRBZST: 0
      },
      btnLoading: false,
      officeInfo: {},
      centreSyNsjgInfo: {}
    }
  },
  methods: {
    // 根据jgsyCode获取单位详情
    getDetailInfo () {
      this.$http
        .get(this.$http.defaults.headcountAPI + `api/busUnit/getDetailInfo?jgsyCode=${this.jgsyCode}`)
        .then(response => {
          if (response.data.success) {
            this.detailInfo = response.data.result
            this.getBusHeadcountDetail()
          } else {
            this.$message({
              message: '获取失败:' + response.data.message,
              type: 'error'
            })
          }
        })
        .catch(error => {
          this.$message({
            message: '网络获取失败:' + error,
            type: 'error'
          })
        })
    },
    // 获取补充表详情
    getBusHeadcountDetail () {
      this.$http
        .get(this.$http.defaults.headcountAPI + `api/busHeadcount/getById?jgsyCode=${this.jgsyCode}`)
        .then(response => {
          if (response.data.success) {
            const result = response.data.result
            if (result) {
              this.detailInfo.countNsjgs = result.countNsjgs
              this.detailInfo.countQtgzjgs = result.countQtgzjgs
              this.detailInfo.DABZST = result.dabzst
              this.detailInfo.SYBZHD = result.sybzhd
            }
            this.$set(this.detailInfo, 'SYBZZB', this.allPersonInfoList.length)
            this.$set(this.detailInfo, 'DRBZST', this.allPersonInfoList.length)
            this.loadingText = ''
          } else {
            this.$message({
              message: '获取失败:' + response.data.message,
              type: 'error'
            })
          }
        })
        .catch(error => {
          this.$message({
            message: '网络获取失败:' + error,
            type: 'error'
          })
        })
    },
    // 保存
    saveData () {
      if (this.sourceTable === 'office') {
        this.saveOffice()
      } else if (this.sourceTable === 'centre_sy_nsjg') {
        this.saveCentreSyNsjg()
      } else {
        this.saveDepartAndcentreSy()
      }
    },
    saveOffice () {
      const para = {
        jgsyCode: this.jgsyCode,
        oabzSt: this.officeInfo.oabzSt,
        orbzSt: this.officeInfo.orbzSt,
        orsybz: this.officeInfo.orsybz,
        oasybz: this.officeInfo.oasybz
      }
      this.btnLoading = true
      this.$http
        .post(this.$http.defaults.headcountAPI + 'api/office/save', para)
        .then(response => {
          if (response.data.success === true) {
            this.btnLoading = false
            this.$message({
              message: '保存成功',
              type: 'success'
            })
          } else {
            console.log('保存失败:' + response.data.message)
            this.$message({
              message: '保存失败:' + response.data.message,
              type: 'error'
            })
            this.btnLoading = false
          }
        })
        .catch(error => {
          console.log(error)
          this.btnLoading = false
        })
    },
    saveCentreSyNsjg () {
      const para = {
        jgsyCode: this.jgsyCode,
        slnCzbkbzrs: this.centreSyNsjgInfo.slnCzbkbzrs,
        slnCzbksyry: this.centreSyNsjgInfo.slnCzbksyry,
        slnJfzlbzrs: this.centreSyNsjgInfo.slnJfzlbzrs,
        slnJfzlsyry: this.centreSyNsjgInfo.slnJfzlsyry,
        slnBzrsZj: this.centreSyNsjgInfo.slnBzrsZj
      }
      this.btnLoading = true
      this.$http
        .post(this.$http.defaults.headcountAPI + 'api/centreSyNsjg/save', para)
        .then(response => {
          if (response.data.success === true) {
            this.btnLoading = false
            this.$message({
              message: '保存成功',
              type: 'success'
            })
          } else {
            console.log('保存失败:' + response.data.message)
            this.$message({
              message: '保存失败:' + response.data.message,
              type: 'error'
            })
            this.btnLoading = false
          }
        })
        .catch(error => {
          console.log(error)
          this.btnLoading = false
        })
    },
    saveDepartAndcentreSy () {
      const para = {
        jgsyCode: this.jgsyCode,
        countNsjgs: this.detailInfo.countNsjgs,
        countQtgzjgs: this.detailInfo.countQtgzjgs,
        dabzst: this.detailInfo.DABZST,
        sybzhd: this.detailInfo.SYBZHD
      }
      this.btnLoading = true
      this.$http
        .post(this.$http.defaults.headcountAPI + 'api/busHeadcount/save', para)
        .then(response => {
          if (response.data.success === true) {
            this.btnLoading = false
            this.$message({
              message: '保存成功',
              type: 'success'
            })
          } else {
            console.log('保存失败:' + response.data.message)
            this.$message({
              message: '保存失败:' + response.data.message,
              type: 'error'
            })
            this.btnLoading = false
          }
        })
        .catch(error => {
          console.log(error)
          this.btnLoading = false
        })
    }
  },
  mounted () {
  }
}
</script>

<style>
#info{
  overflow: hidden;
}
</style>
